<template>
  <view class="receiver-dashboard">
    <ikz-loading :css-data="loading_css"></ikz-loading>
    
    <!-- 顶部用户信息 -->
    <view class="user-header">
      <ikz-head
        :show-data="user_all_info"
        :user-info="user_info"
        status="2"
      ></ikz-head>
    </view>

    <!-- 主内容区 -->
    <scroll-view class="content-scroll" scroll-y>
      <!-- 数据概览 -->
      <view class="data-overview">
        <view class="data-card" @click="orderList(2)">
          <view class="data-icon in-progress">
             <img src="../../../../../../../static/jinxing.png" alt="" style="    width: 100%;
    height: 100%;">
          </view>
          <view class="data-content">
            <view class="data-label">进行中订单</view>
            <view class="data-value">{{ user_all_info1.in_progress_order_count }}</view>
          </view>
        </view>
        
        <view class="data-card" @click="orderList(3)">
          <view class="data-icon completed">
            <img src="../../../../../../../static/wancheng.png" alt="" style="    width: 100%;
    height: 100%;">
          </view>
          <view class="data-content">
            <view class="data-label">已完成订单</view>
            <view class="data-value">{{ user_all_info1.finish_order_count }}</view>
          </view>
        </view>
      </view>

      <!-- 统计图表 -->
      <view class="stats-section">
        <view class="section-title">数据统计</view>
        <view class="stats-container">
          <ikz-statistics
            :show-data="user_all_info"
            status="2"
          ></ikz-statistics>
        </view>
      </view>
    </scroll-view>

    <!-- 底部操作按钮 -->
    <view class="action-bar">
      <view class="action-btn primary" @click="orderList(1)">
        <image class="action-icon" src="/static/receiver/orderReceiving.png"></image>
        <text>抢单大厅</text>
      </view>
    </view>
  </view>
</template>

<script>
import ikzLoading from "@/pages/Component/Public/Loading/loading.vue";
import ikzHead from "@/pages/Component/Public/Receiverhead/public/login/login.vue";
import ikzStatistics from "@/pages/Component/Public/Statistics/public/statistics/index.vue";
var app = getApp();
import ikz from "@/pages/Common/tools.js";
export default {
  components: {
    ikzLoading,
    ikzHead,
    ikzStatistics,
  },
  data() {
    return {
      adminFontPath: app.globalData.adminFontPath,
      form_data: {
        name: "",
        student_no: "",
        student_positive_image: "",
        code_image: "",
      },
      files: [],
      loading_css: {
        display: "flex",
      },
      user_all_info: {},
      user_info: {},
      user_all_info1: {},
    };
  },
  onShow() {
    this.getOrderStatistics();
    this.userInfo((res) => {
      this.loading_css.display = "none";
    });
    this.getUpdate();
  },
  onPullDownRefresh() {
    this.userInfo((res) => {
      uni.stopPullDownRefresh();
    });
  },
  created() {
    // var that = this;
  },
  methods: {
    getOrderStatistics() {
      // 获取进行中订单
      this.getOrderCountByStatus(2, (count) => {
        this.$set(this.user_all_info1, "in_progress_order_count", count);
      });

      // 获取已完成订单
      this.getOrderCountByStatus(3, (count) => {
        this.$set(this.user_all_info1, "finish_order_count", count);
      });
    },
    getOrderCountByStatus(status, callback) {
      const path = "/xyb/user_receive/order_list";
      const data = {
        page: 1,
        limit: 1, // 只需要获取总数，所以page_size设为1
        receive_status: status,
      };

      ikz.post(path, data, (res) => {
        if (res.data.code) {
          callback(res.data.data.total || 0);
        }
      });
    },
    userInfo(fn) {
      var path = "/xyb/user_receive/center";
      var data = {};
      ikz.post(path, data, (res) => {
        if (res.data.code) {
          this.user_all_info = res.data.data;
        } else {
          uni.showModal({
            title: "提示",
            content: res.data.msg,
            showCancel: false,
            success: function (res) {},
          });
        }
        fn();
        uni.hideLoading();
        // if(that.pull_status){
        // 	this.$emit("change",'pull');
        // }
      });
    },
    //获取头像和名称
    getUpdate() {
      var path = "/xyb/user/baseinfo";
      var data = {
        token: uni.getStorageSync("local_user_session"),
        app_plat: "MP-WEIXIN",
      };
      ikz.get(path, data, (res) => {
        if (res.data.code) {
          this.user_info = res.data.data.user_info;
        }
      });
    },
    orderList(status) {
      uni.navigateTo({
        url: "../../order/index/index?status=" + status,
      });
    },
  },
};
</script>

<style lang="scss" scoped>
/* 颜色变量 */
$primary-color: #FBAB7E;
$secondary-color: #F8C66D;
$text-color: #333;
$light-text: #666;
$white: #fff;
$bg-color: #f8f8f8;
$card-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.08);

.receiver-dashboard {
  height: 100vh;
  display: flex;
  flex-direction: column;
  background-color: $bg-color;
}

.user-header {
  padding: 20rpx;
  background: linear-gradient(135deg, $secondary-color, $primary-color);
}

.content-scroll {
  flex: 1;
  padding: 20rpx;
}

/* 数据概览卡片 */
.data-overview {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20rpx;
  margin-bottom: 30rpx;
}

.data-card {
  background: $white;
  border-radius: 16rpx;
  padding: 30rpx;
  box-shadow: $card-shadow;
  display: flex;
  align-items: center;
  
  .data-icon {
    width: 80rpx;
    height: 80rpx;
    border-radius: 50%;
    margin-right: 20rpx;
  }
  
  .data-label {
    font-size: 28rpx;
    color: $light-text;
    margin-bottom: 8rpx;
  }
  
  .data-value {
    font-size: 36rpx;
    font-weight: 700;
    color: $text-color;
  }
}

/* 统计区域 */
.stats-section {
  background: $white;
  border-radius: 16rpx;
  padding: 30rpx;
  box-shadow: $card-shadow;
  
  .section-title {
    font-size: 32rpx;
    font-weight: 600;
    color: $text-color;
    margin-bottom: 20rpx;
    padding-left: 20rpx;
    position: relative;
    
    &::before {
      content: "";
      position: absolute;
      left: 0;
      top: 50%;
      transform: translateY(-50%);
      height: 30rpx;
      width: 6rpx;
      background: $primary-color;
      border-radius: 3rpx;
    }
  }
}

/* 底部操作栏 */
.action-bar {
  padding: 20rpx;
  background: $white;
  box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.05);
  
  .action-btn {
    height: 100rpx;
    border-radius: 50rpx;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 32rpx;
    font-weight: 500;
    
    &.primary {
      background: linear-gradient(135deg, $secondary-color, $primary-color);
      color: $white;
    }
    
    .action-icon {
      width: 40rpx;
      height: 40rpx;
      margin-right: 15rpx;
    }
  }
}

/* 响应式调整 */
@media (max-width: 375px) {
  .data-card {
    padding: 20rpx;
    
    .data-icon {
      width: 60rpx;
      height: 60rpx;
    }
    
    .data-label {
      font-size: 26rpx;
    }
    
    .data-value {
      font-size: 32rpx;
    }
  }
}
</style>